<template>
  <div>
    <h1>这里面用来去测试一些功能</h1>

    <button @click="test">发送请求</button>
    <!-- 映射写法 -->
    <h1>显示总store当中e:{{ e }}</h1>
    <h1>显示home模块当中name: {{ name }}</h1>
    <h1>显示user模块当中name:{{ name1 }}</h1>
    <button @click="test">触发home当中fn1这个actions函数</button>
    <button @click="test2">触发user当中FN2这个mutations函数</button>
  </div>
</template>

<script>
import { mapState } from "vuex";
export default {
  name: "Test",
  computed: {
    ...mapState(["e"]),
    ...mapState({
      //函数的形参可以接收到总的store当中的state
      name: state => state.home.name,
      name1: state=> state.user.name,
    }),
  },
  methods: {
    // async test() {
    //   // 接口函数
    //   const res = await reqCategoryList();
    //   console.log(res);

    //   //   try {
    //   //     const res = await axios({
    //   //       url: "/api/product/getBaseCategoryList",
    //   //       method: "get",
    //   //     });
    //   //     console.log(res.data.data, "res");
    //   //   } catch (error) {}
    // },
    test() {
      this.$store.dispatch("fn1");
    },
    test2() {
      this.$store.commit("FN2");
    },
  },
};
</script>

<style lang="less" scoped>
</style>
